<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>新闻动态</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" type="text/css" href="../../plugins/mui/mui.min.css"/>
		<link rel="stylesheet" type="text/css" href="../../plugins/mui/picker/mui.picker.min.css"/>
		<script src="../../js/statistics.js"></script>
		<style>
			body,.mui-content{
				background: #fff;
			}
			.header{
				background: #2a2c33;
			}
			.header h1{
				color:#fff;
				font-size:18px;
			}
			.header a{
				color:#fff;
				font-size: 16px;
				padding: 11px 0;
			}
			.choose{
				display: inline-block;
				width: 108px;
				line-height: 26px;
				border: 1px solid #b8b8b8;
				background: #f5f5f5;
				border-radius: 18px;
				text-align: center;
				margin: 20px 12px;
			}
			.choose>span{
				font-size: 14px;
				padding-right: 20px;
				color: #333;
				background: url(../../images/icon/news_list/switch.png) right no-repeat;
				background-size: 15px;
			}
			.date-box{
				display: flex;
				justify-content: space-between;
				padding: 20px 20px 0;
			}
			.date-box>div{
				width: 40vw;
				height: 30px;
				text-align: center;
				display: inline-block;
				color: #dbdbdb;
				border-bottom: 1px solid #dbdbdb;
			}
			#month>div{
				width: 100%;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav header">
			<a class="mui-pull-left">取消</a>
			<h1 class="mui-title">溧阳新闻</h1>
			<a class="mui-pull-right">确定</a>
		</header>
		<div class="mui-content">
			<div class="choose">
				<span>按日选择</span>
			</div>
			<div>
				<div class="date-box" id="day">
					<div>开始时间</div>&nbsp;至&nbsp;<div>结束时间</div>
				</div>
				<div class="date-box" id="month" style="display: none;">
					<div>选择月份</div>
				</div>
			</div>
			
		</div>
		<script src="../../plugins/mui/mui.min.js"></script>
		<script type="text/javascript" src='../../plugins/jquery/jquery-3.1.0.min.js'></script>
		<script type="text/javascript" src="../../plugins/mui/picker/mui.picker.min.js"></script>
		
		<script>
			//启用双击监听
			mui.init({
				
			});
			mui.plusReady(function(){
				var self = plus.webview.currentWebview(),
					startTime,endTime;
				var type = 1;
				var sonPage = plus.webview.getWebviewById('video_news.html');
				mui(".header").on('tap','.mui-pull-left',function(){
					self.close();
				});
				mui(".header").on('tap','.mui-pull-right',function(){
					var time;
					if(type == 1){
						time = $(".date-box:first-child").find('div:first-child').text()+','+$(".date-box:first-child").find('div:last-child').text();
					}else{
						time = $(".date-box:last-child").find('div').text();
					}
					var reg = new RegExp("[\\u4E00-\\u9FFF]+","g");
					if(reg.test(time)){
						mui.toast('请选择日期~');
					}else{
						mui.fire(sonPage,'checkDate',{'type':type,'time':time});
						self.close();
					}
					
				});
				$("#day>div").each(function(k,e){
					$(this).on('tap',function(){
						var _this = $(this);
						var options = {
							"type": "date",
						    "endDate": new Date()
						};
						if(k == 0){
							if(endTime){
								options.endDate = new Date(endTime.year,endTime.month-1,endTime.day);
							}
							var dtpicker = new mui.DtPicker(options);
							dtpicker.show(function(rs){
								startTime = {
									'year':rs.y.value,
									'month':rs.m.value,
									'day':rs.d.value
								};
								_this.text(rs.text);
								_this.css('color','#333');
								dtpicker.dispose();
							});
						}else{
							if(startTime){
								options.beginDate = new Date(startTime.year,startTime.month-1,startTime.day);
							}
							var dtpicker = new mui.DtPicker(options);
							dtpicker.show(function(rs){
								endTime = {
									'year':rs.y.value,
									'month':rs.m.value,
									'day':rs.d.value
								};
								_this.text(rs.text);
								_this.css('color','#333');
								dtpicker.dispose();
							});
						}
					})
				});
				$("#month>div").on('tap',function(){
					var _this = $(this);
					var dtpicker = new mui.DtPicker({
						'type': "month",
						'endDate': new Date()
					});
					dtpicker.show(function(rs){
						_this.text(rs.text);
						_this.css('color','#333');
						dtpicker.dispose();
					});
				});
		
				$(".choose").on('tap',function(){
					if(type == 1){
						$(".date-box:last-child").show().siblings().hide();
						$(this).find('span').text('按月选择');
						type = 2;
					}else{
						$(".date-box:first-child").show().siblings().hide();
						$(this).find('span').text('按日选择');
						type = 1;
					}
				})
			});
		</script>
	</body>
</html>